import React, {lazy, useEffect} from 'react';
// import './App.css';
import {HashRouter, Redirect, Route, Switch,} from "react-router-dom";
import menus from "./Routes/RouteMap"
import Routers from "./Routes/Routers";
import Login from "./page/Login";
import Context from "./context";

function App(props) {
    console.log('render  App')
    let routes = []

    function renderRoutes(routeMap) {
        routeMap.map(item => {
            if (item.children) {
                return renderRoutes(item.children)
            } else {
                routes.push(
                    <Route key={item.uri} path={item.uri} component={lazy(item.component)} exact={true}/>
                )
            }
        })
    }

    renderRoutes(menus)
    // routes.push(<Redirect key={'home'} from={"/home"} to={"/Home/ChannelConfig"} exact/>)
    return (
        <div className="App">
            <HashRouter forceRefresh={true}>
                <Switch>
                    <Route path={"/login"} component={Login} exact={true}/>
                    <Routers>
                        {
                            routes
                        }
                        <Redirect from={"/"} to={"/login"} exact/>
                    </Routers>

                </Switch>
            </HashRouter>
        </div>
    );
}

export default App;
